<template>
    <div class="chat">
        <van-nav-bar fixed placeholder title="消息" left-arrow @click-left="fh" />
        <van-pull-refresh v-model="refreshing" @refresh="onRefresh">
            <van-list>
                <!-- <van-cell v-for="item in list" :key="item" :title="item" /> -->
                <div class="chatitem" v-for="item in list" :key="item.cover" @click="tokefuchat(item)">
                    <img style="width: 50px; height: 50px" :src="item.cover" alt="" />
                    <div class="chatitem_content">
                        <div>{{ item.title }}</div>
                        <div class="content_xx">{{ item.title }}</div>
                    </div>
                    <div class="chatitem_time">
                        <div>{{ item.update_time }}</div>
                    </div>
                </div>
            </van-list>
        </van-pull-refresh>
    </div>
</template>
  
<script>
import { getChatContent, getuserchatList } from '../../api/index';
export default {
    name: 'HelloWorld',
    data() {
        return {
            list: [],
            loading: false,
            finished: false,
            refreshing: false,
            orderid: '',
            limit: '',
            page: ''
        };
    },
    async created() {
        this.query();
    },
    methods: {
        tokefuchat(item){
            let orderid=item.id
            this.$router.push({name:'kefuchat',query:{orderid}})
        },
        fh() {
            clearInterval(this.stime);
            this.$router.back();
        },
        async query() {
            let res = await this.$frontaxios.get(this.$front.getUserChatList);
            this.list = res.data.list; 
            console.log(res);
        },
        onLoad() {
            // setTimeout(() => {
            //     if (this.refreshing) {
            //         this.list = [];
            //         this.refreshing = false;
            //     }
            //     for (let i = 0; i < this.list.length; i++) {
            //         this.list.push(this.list.length + 1);
            //     }
            //     this.loading = false;
            //     if (this.list.length >= 10) {
            //         this.finished = true;
            //     }
            // }, 1000);
        },
        onRefresh() {
            // 清空列表数据
            this.finished = false;
            // 重新加载数据
            // 将 loading 设置为 true，表示处于加载状态
            this.loading = true;
            this.onLoad();
        }
    }
};
</script>
  
<style>
.chatitem {
    height: 50px;
    background-color: #fff;
    /* border: 1px solid #CCC; */
    width: 100%;
    display: flex;
}
.chatitem_content {
    margin-left: 10px;
    font-size: 14px;
    padding: 5px 0;
}
.chatitem_time{
    position:absolute;
    right: 0;
    font-size: 12px;
    color: #CCC;
    padding: 10px;
}
.content_xx{
    color: #CCC;
}
</style>